<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <style>
        .descendants *{
            display: block;
            border:2px solid lightgrey;
            color: lightgrey;
            padding: 5px;
            margin: 15px;
        }
        </style>
        <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
        </script>
           
        <script>
             $(document).ready(function(){
                $("div").children("p.1").css({
                    "color":"red","border":"2px solid red"
                });
            });
        </script>
    </head>
    <body>
    <div class="descendants" style="width:500px">div当前元素
             <p class="1">p儿子元素
                 <span>span 孙子元素</span>

             </p>
             <p class="2">p 儿子元素
                 <span>
                     span 孙子元素
                 </span>

             </p>
        </div>

    </body>
</html>